body {
	margin: 0px;
	font-family: "微软雅黑";
	font-size: 14px;
}

a {
	text-decoration: none;
	color: #333;
}

ul.list {
	margin: 0;
	padding: 0;
	list-style: none;
}

ul.list:after {
	display: block;
	content: "";
	clear: both;
}

ul.list>li {
	float: left;
}

ul.list>li:last-child {
	margin-right: 0px!important;
}

.clear:after {
	display: block;
	content: "";
	clear: both;
}

.left {
	float: left;
}

.right {
	float: right;
}

.w {
	width: 1200px;
	margin-left: auto;
	margin-right: auto;
}

.floor {
	min-width: 1200px;
	padding: 62px 0px 72px;
}

.floor h1.title {
	text-align: center;
	margin: 0px;
	font-size: 50px;
	color: #14283c;
	font-weight: normal;
}

h1.title .red {
	color: #fe3a5e;
}


/* 文字下面的线 */

h1.title .linear {
	position: relative;
	border-bottom: solid 1px #bfbfbf;
}


/* 线上的那个红线 */

h1.title .linear:after {
	display: block;
	content: "";
	width: 84px;
	height: 2px;
	position: absolute;
	bottom: -1px;
	left: 50%;
	margin-left: -42px;
	background-color: #fd4365;
}

p.desc {
	font-size: 20px;
	line-height: 30px;
	color: #7d7d7d;
	text-align: center;
	margin: 24px 0px 0px;
}

.floor-deep {
	background-color: #292e41;
}

.floor-deep h1.title {
	color: #FFFFFF;
}

.floor-deep p.desc {
	color: #FFFFFF;
}

.floor-gray {
	background-color: #eeeeee;
}

.floor-red {
	background-color: #fd4365;
}

h1.title .white {
	color: #FFFFFF;
}

h1.title .yellow {
	color: #f6f31c;
}

.floor-red h1.title .linear {
	position: relative;
	border-bottom: solid 1px #7d7d7d;
}

.floor-red h1.title .linear:after {
	background-color: #FFFFFF;
}

.floor-red p.desc {
	color: #FFFFFF;
}

.btn {
	margin-top: 78px;
	text-align: center;
}

.btn button {
	width: 325px;
	height: 78px;
	border: none;
	outline: none;
	color: #fff;
	font-size: 24px;
	border-radius: 39px;
	background-image: linear-gradient(0deg, #fe284a 0%, #fc668a 100%);
}


/*顶部 */

.top {
	height: 70px;
	/*background-color:red;*/
	/*
	 *   水平偏移   垂直偏移  模糊程度   阴影大小   阴影颜色    [内阴影]
	 * */
	/*box-shadow: 0px -10px 30px 1px gainsboro inset;*/
}

.banner {
	height: 600px;
	background-color: #2c0033;
	background-image: url(../img/banner.jpg);
	background-size: auto 600px;
	background-position: center;
	background-repeat: no-repeat;
}

.floor-1 {}


/* 工资水平 */

.floor-1 .gongzi {
	height: 470px;
	margin-top: 42px;
	box-shadow: 0px 3px 7px 0px rgba(160, 160, 160, 0.35);
	border-radius: 10px;
	border: solid 1px #d2d2d2;
	box-sizing: border-box;
	padding: 30px 22px 0px;
}

.floor-1 .gongzi:hover {
	-webkit-animation-name: shake;
	animation-name: shake;
}


/* 左边 */

.floor-1 .gongzi .left {
	width: 470px;
	padding-top: 54px;
	text-align: center;
}

.floor-1 .gongzi .title {
	font-size: 36px;
	font-weight: normal;
	color: #292e41;
	margin: 0px 0px 50px;
}

.floor-1 .gongzi .red {
	color: #fe3a5e;
}

.floor-1 .gongzi h1 {
	font-size: 60px;
	color: #fe3a5e;
	font-weight: normal;
	margin: 0px 0px 36px;
}

.floor-1 .gongzi .tips-1 {
	margin: 0px 0px 40px;
	font-size: 20px;
}

.floor-1 .gongzi .tips-2 {
	text-align: left;
	font-size: 15px;
	line-height: 24px;
	margin: 0;
	color: #535353;
}


/* 右边  */

.floor-1 .gongzi .right {}

.floor-2 {}

.floor-2 .list {
	margin-left: 40px;
	margin-top: 75px;
}

.floor-2 .list li {
	width: 205px;
	text-align: center;
	margin-right: 100px;
	/*background-color: red;*/
}

.floor-2 .list li img {
	width: 100px;
	height: 118px;
}

.floor-2 .list .box {
	margin-top: 44px;
	padding: 36px 24px 0px;
	width: 205px;
	height: 184px;
	border-radius: 5px;
	box-sizing: border-box;
	background-color: #fff;
	position: relative;
}

.floor-2 .list .box:after {
	display: block;
	content: "";
	width: 150px;
	height: 10px;
	border-radius: 0px 0px 5px 5px;
	position: absolute;
	background-image: linear-gradient(0deg, #fd4365 0%, #fc6185 100%);
	bottom: -10px;
	left: 27.5px;
}

.floor-2 .list li:nth-child(2) .box:after {
	background-image: linear-gradient(180deg, rgba(252, 231, 160, 0.97) 0%, rgba(255, 174, 0, 0.97) 100%), linear-gradient(0deg, #fd4365 0%, #fc6185 100%);
}

.floor-2 .list li:nth-child(3) .box:after {
	background-image: linear-gradient(180deg, rgba(252, 223, 122, 0.97) 0%, rgba(252, 162, 129, 0.97) 0%, rgba(252, 100, 136, 0.97) 0%, rgba(178, 160, 190, 0.97) 0%, rgba(103, 219, 244, 0.97) 0%, rgba(3, 133, 255, 0.97) 100%), linear-gradient(0deg, #fd4365 0%, #fc6185 100%);
}

.floor-2 .list li:nth-child(4) .box:after {
	background-image: linear-gradient(180deg, rgba(238, 160, 252, 0.97) 0%, rgba(255, 0, 234, 0.97) 100%), linear-gradient(0deg, #fd4365 0%, #fc6185 100%);
}

.floor-2 .list .title {
	font-size: 38px;
	margin-bottom: 20px;
}

.floor-2 .list .desc {
	display: block;
	font-size: 16px;
	line-height: 1.2em;
	text-align: left;
}

.floor-3 {}

.floor-3 .shejishi {
	margin-top: 58px;
}

.floor-3 .list {
	margin-left: 32px;
}

.floor-3 .list li {
	width: 222px;
	/*height: 400px;*/
	margin-right: 82px;
	/*background-color: red;*/
}

.floor-3 .list .jieduan {
	height: 200px;
	padding-left: 20px;
	border-left: dotted 4px #333333;
}

.floor-3 .jieduan .title {
	font-size: 24px;
	margin-bottom: 26px;
}

.floor-3 .jieduan button.left {
	width: 68px;
	height: 26px;
	background-image: linear-gradient(0deg, #fe2d4f 0%, #fc6388 100%), linear-gradient( #535353, #535353);
	font-size: 14px;
	color: #FFFFFF;
	border: none;
	outline: none;
	border-radius: 13px;
}

.floor-3 .jieduan .nianxin {
	font-size: 20px;
	color: #fe3a5e;
}

.floor-3 .jieduan table {
	margin-top: 15px;
	font-size: 14px;
}

.floor-3 .jieduan table td {
	vertical-align: top;
	text-align: left;
}

.floor-3 .pser {
	height: 352px;
	position: relative;
}

.floor-3 .pser img {
	position: absolute;
	bottom: 0px;
}

.floor-4 {}

.floor-4 .list {
	margin-top: 60px;
}

.floor-4 .list li {
	width: 270px;
	/*height:200px;*/
	text-align: center;
	/*background-color: red;*/
	margin-right: 40px;
}

.floor-4 .list li .title {
	font-size: 30px;
	color: #333333;
	margin-bottom: 40px;
}

.floor-4 .list li .red {
	font-size: 50px;
	color: #fe3a5e;
}

.floor-4 .list li .box {
	width: 270px;
	height: 230px;
	position: relative;
	background-size: contain;
	background-image: url(../img/kc_bg.png);
}

.floor-4 .list li .icon {
	width: 64px;
	height: 64px;
	position: absolute;
	top: 60px;
	left: 106px;
	border-bottom: solid 2px #fd4365;
}

.floor-4 .list li .icon img {
	max-width: 64px;
}

.floor-4 .list li .text {
	position: absolute;
	bottom: 34px;
	font-size: 36px;
	color: #FFFFFF;
	width: 100%;
}

.floor-4 .list li .big {
	font-size: 50px;
}

.floor-4 .tips-text {
	font-size: 20px;
	color: #fe2b4d;
	text-align: center;
	margin: 84px 0px 48px;
}

.floor-5 {}

.floor-5 .part {
	margin-top: 90px;
	padding-left: 34px;
}

.floor-5 .part>.list {}

.floor-5 .part>.list .title {
	height: 40px;
	line-height: 40px;
	background-color: #ffffff;
	border-radius: 5px;
	color: #fd4365;
	font-size: 20px;
	text-align: center;
	left: 10px;
	right: 10px;
	top: -12px;
	position: absolute;
}

.floor-5 .part>.list>li {
	margin-right: 26px;
	padding: 55px 10px 16px;
	border-radius: 5px;
	position: relative;
}


/* hover效果 */

.floor-5 .part>.list>li:hover {
	background-color: rgba(0, 0, 0, 0.2);
}

.floor-5 .part>.list>li:hover .title {
	background-color: #fd4365;
	color: #FFFFFF;
}

.floor-5 .part li .list li {
	margin-right: 12px;
}

.floor-5 .time-line {
	text-align: center;
}


/* 6楼 */

.floor-6 {}

.floor-6 .step {
	margin-top: 60px;
}

.floor-6 .step .list>li {
	margin-right: 31px;
	width: 215px;
	height: 513px;
	border-radius: 0px 10px 10px 10px;
	position: relative;
	background-image: url(../img/sanjiao.png);
	background-position: left top;
	background-repeat: no-repeat;
	/*background-color: blue;*/
	box-shadow: 0px 0px 20px 2px gainsboro;
}

.floor-6 .step:hover .list>li:nth-child(1) {
	-webkit-animation-name: bounceInLeft;
	animation-name: bounceInLeft;
}

.floor-6 .step:hover .list>li:nth-child(2) {
	-webkit-animation-name: bounceInLeft;
	animation-name: bounceInLeft;
}

.floor-6 .step:hover .list>li:nth-child(3) {
	-webkit-animation-name: bounceInDown;
	animation-name: bounceInDown;
}

.floor-6 .step:hover .list>li:nth-child(4) {
	-webkit-animation-name: bounceInRight;
	animation-name: bounceInRight;
}

.floor-6 .step:hover .list>li:nth-child(5) {
	-webkit-animation-name: bounceInRight;
	animation-name: bounceInRight;
}

.floor-6 .step li .number {
	font-size: 40px;
	color: #FFFFFF;
	display: block;
	width: 45px;
	font-family: Arial;
	text-align: center;
	position: absolute;
	top: 0px;
	left: 0px;
}

.floor-6 .step-img {
	padding-top: 22px;
	text-align: center;
}

.floor-6 .step-img img {
	width: 80px;
	height: 80px;
}

.floor-6 p.title {
	font-size: 20px;
	text-align: center;
	margin: 16px 0px 28px;
}

.floor-6 .course {
	margin: 0;
	padding: 0;
	text-align: center;
	list-style: none;
	font-size: 16px;
	line-height: 27px;
}

.floor-6 .course li {}

.floor-6 .step button {
	width: 154px;
	height: 40px;
	font-size: 16px;
	border-radius: 20px;
	background-color: #FFFFFF;
	border: solid 1px #fd4365;
	outline: none;
	position: absolute;
	left: 30px;
	bottom: 26px;
}

.floor-6 .step li:hover button {
	color: #FFFFFF;
	background-image: linear-gradient(180deg, rgba(176, 239, 99, 0.97) 0%, rgba(214, 197, 111, 0.97) 0%, rgba(252, 154, 122, 0.97) 0%, rgba(252, 127, 129, 0.97) 0%, rgba(252, 100, 136, 0.97) 0%, rgba(254, 48, 82, 0.97) 100%), linear-gradient( #fd4365, #fd4365);
}

.floor-7 {}

.floor-7 .taocan {
	margin-top: 90px;
}

.floor-7 .taocan li {
	width: 292px;
	height: 236px;
	overflow: hidden;
	margin-right: 10px;
	background-color: red;
	position: relative;
}

.floor-7 .taocan img {
	width: inherit;
	height: inherit;
}

.floor-7 .course-info {
	width: 100%;
	box-sizing: border-box;
	position: absolute;
	font-size: 18px;
	color: #FFFFFF;
	bottom: -53px;
	padding: 14px 10px 10px;
	background-color: #fd4365;
	-webkit-transition: all 0.2s linear;
	border-bottom: solid 5px #252b44;
}

.floor-7 .taocan li:hover .course-info {
	bottom: 0px;
}

.floor-7 .course-info .keshi {
	position: relative;
	top: 4px;
	font-size: 14px;
}

.floor-8 {}

.floor-8 .books {
	margin-top: 70px;
}

.floor-8 .books li {
	width: 223px;
	/*background-color: red;*/
	margin-right: 21px;
}

.floor-8 .books li:hover img {
	-webkit-animation-name: bounce;
	animation-name: bounce;
	-webkit-transform-origin: center bottom;
	transform-origin: center bottom;
}

.floor-8 .books li img {
	width: 223px;
	height: 314px;
}

.floor-8 .book-name {
	text-align: center;
	font-size: 24px;
	color: #FFFFFF;
	margin: 30px 0px 0px;
}

.floor-9 {
	overflow: hidden;
}

.floor-9 .ppha {
	width: 524px;
	height: 524px;
	/*background-color: red;*/
	/*border: solid 1px red;*/
	margin: 90px auto 0;
	position: relative;
	-webkit-perspective: 800px;
}

.floor-9 .in,
.floor-9 .out {
	width: 524px;
	height: 524px;
	position: absolute;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	background-position: center;
}

.floor-9 .in {
	background-image: url(../img/ppha.png);
	/*-webkit-animation: circle-run-y 5s linear infinite;*/
}

.floor-9 .out {
	top: -10px;
	height: 535px;
	-webkit-transform-origin-y: 273px;
	-webkit-animation: circle-run 2s linear infinite;
	background-image: url(../img/wai.png);
}

.floor-9 .tag{
	position: absolute;
}

.floor-9 .item-1{
	top: -10px;
	left: -220px;
}
.floor-9 .item-2{
	top: 210px;
	left: -298px;
}
.floor-9 .item-3{
	top: 440px;
	left: -153px;
}
.floor-9 .item-4{
	top: -10px;
	right: -230px;
}
.floor-9 .item-5{
	top: 200px;
	right: -300px;
}
.floor-9 .item-6{
	top: 440px;
	right: -153px;
}

@-webkit-keyframes circle-run {
	from {
		-webkit-transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(360deg);
	}
}

@-webkit-keyframes circle-run-y {
	from {
		-webkit-transform: rotateY(0deg);
	}
	10% {
		-webkit-transform: rotateY(360deg);
	}
	50% {
		-webkit-transform: rotateY(360deg);
	}
	90% {
		-webkit-transform: rotateY(0deg);
	}
	to {
		-webkit-transform: rotateY(0deg);
	}
}

.floor-10{
	background-image: url(../img/bubble.png);
	background-position: center top; 
	background-repeat: no-repeat;
	
}

.floor-10 .shixun{
	background-color: #FFFFFF;
	padding: 35px;
	background-image: url(../img/red_sanjiao.png);
	background-position: center top;
	background-repeat: no-repeat; 
	margin: 50px 0px 70px;
}


.floor-10 .shixun li{
	width: 338px;
	height: 255px;
	margin-right:58px;
	overflow: hidden;
}
.floor-10 .shixun li img{
	width: 100%;
	height: 100%;
	position: relative;
	left: 0%;
	top: 0%;
	-webkit-transition: all 0.2s linear;
}

.floor-10 .shixun li:hover img{
	left: -10%;
	top: -10%;
	width: 120%;
	height: 120%;
}

.floor-12{}
.floor-12 .gongsi{
	width: 100%;
	height: 406px;
	margin-top: 58px;
	position: relative;
	background-color: red;
}

.floor-12 .gongsi .item{ 
	width: 200px;
	height: 200px;
	-webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
	position: absolute;
}
.floor-12 .gongsi .item img{
	width: 200px;
	height: 200px;
} 

.floor-12 .gongsi .item-1 {
	top: 105px;
	left: -32px;
}

.floor-12 .gongsi .item-2 {
	top: 0px;
	left: 72px;
}

.floor-12 .gongsi .item-3 {
	top: 210px;
	left: 72px;
}

.floor-12 .gongsi .item-4 {
	top: 105px;
	left: 178px;
}

.floor-12 .gongsi .item-5 {
	top: 0px;
	left: 282px;
}

.floor-12 .gongsi .item-6 {
	top: 210px;
	left: 282px;
}

.floor-12 .gongsi .item-7 {
	top: 105px;
	left: 388px;
}

.floor-12 .gongsi .item-8 {
	top: 0px;
	left: 492px;
}

.floor-12 .gongsi .item-9 {
	top: 210px;
	left: 492px;
}

.floor-12 .gongsi .item-10 {
	top: 105px;
	left: 598px;
}

.floor-12 .gongsi .item-11 {
	top: 0px;
	left: 702px;
}

.floor-12 .gongsi .item-12 {
	top: 210px;
	left: 702px;
}

.floor-12 .gongsi .item-13 {
	top: 105px;
	left: 808px;
}

.floor-12 .gongsi .item-14 {
	top: 0px;
	left: 912px;
}

.floor-12 .gongsi .item-15 {
	top: 210px;
	left: 912px;
}

.floor-12 .gongsi .item-16 {
	top: 105px;
	left: 1018px;
}


.floor-12 .gongsi:hover .item{
	 -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}


